<template>
	<view class="page" v-if="loadding" :style="{minHeight:windowHeight+'px'}">		
		<view class="page-head">
			<view class="page-head-img">
				<image class="location" src="../../static/dafaulthead2.png" v-if="detail.avatarUrl == '' "></image>
				<image :src="detail.avatarUrl" mode="aspectFill" title="头像" v-else></image>
			</view>
			<view class="page-head-input" @click="showMulLinkageThreePicker">
				<text class="page-head-Select">{{location}}</text>
				<!-- <input class="page-head-Select" type="text" :value="location" disabled="" /> -->
				<image class="select-img"  src="../../static/app/jiaotou2.png"></image>
			</view>
		</view>
		<view class="head-banner">
			<swiper :indicator-dots="true" circular=""  :autoplay="true" :interval="3000" :duration="1000">				
				<!-- <swiper-item class="swiper-item" v-for="(item,index) in adList" :key="index">
					<image :src="item" mode=""></image>
				</swiper-item> -->
				<swiper-item class="swiper-item" v-for="(item,index) in swiper" :key="index">
					<image :src="item.image.file_path" mode=""></image>
				</swiper-item>
			</swiper>
		</view>

		<view class="page-nav" >
			<view class="page-nav-item" @click="tabTypeFunc(1)">
				<view class="nav-msg  null" v-if=" carAll== ''"></view>
				<view class="nav-msg" v-if="carAll[1] !=0">{{carAll[1]}}</view>
				<view class="nav-icon">
					<image src="../../static/app/nav-icon1.png" mode=""></image>
				</view>
				<view class="nav-title">单位用车</view>
			</view>
			<view class="page-nav-item" @click="tabTypeFunc(2)">
				<view class="nav-msg  null" v-if=" carAll== '' "></view>
				<view class="nav-msg" v-if="carAll[2] !=0">{{carAll[2]}}</view>
				<view class="nav-icon">
					<image src="../../static/app/nav-icon2.png" mode=""></image>
				</view>
				<view class="nav-title">旅行社用车</view>
			</view>
			<view class="page-nav-item" @click="tabTypeFunc(3)">
				<view class="nav-msg  null" v-if=" carAll== '' "></view>
				<view class="nav-msg" v-if="carAll[3] !=0">{{carAll[3]}}</view>
				<view class="nav-icon">
					<image src="../../static/app/nav-icon3.png" mode=""></image>
				</view>
				<view class="nav-title">个人用车</view>
			</view>
			<!-- <view class="page-nav-item" @click="tabTypeFunc(peerId)">
				<view class="nav-msg  null" v-if=" useCar.peer== '' "></view>
				<view class="nav-msg" v-else>{{useCar.peer}}</view>
				<view class="nav-icon">
					<image src="../../static/app/nav-icon4.png" mode=""></image>
				</view>
				<view class="nav-title">同行甩单</view>
			</view> -->
		</view>

		<view class="swiper-msg-wrap">
			<view class="msg-icon">
				<image src="../../static/app/notice-icon.png" mode=""></image>
			</view>
			    <swiper class="swiper-msg" circular=""  vertical="true" autoplay="false" duration="500" interval="4000">
				     <swiper-item class="swiper-msg-item"  v-for="(item, index) in 5"  :key="index">
					      <view >{{msg}}</view>
					     </swiper-item>
				    </swiper>
		</view>

		<view class="list-wrap">
			<view class="list-head">
				<view class="list-item">
					<view class="list-title" @click="gototodayCar(1,order_type)">今日车单</view>
					<view class="list-msg list-msg1 null" v-if="todayNum == '' "></view>
					<view class="list-msg list-msg1" v-else>{{todayNum}}</view>	
				</view>
				<view class="line"></view>
				<view class="list-item">
					<view class="list-title" @click="gototrimesterCar(2,order_type)">三日内车单</view>
					<view class="list-msg null" v-if="trimesterNum == '' "></view>
					<view class="list-msg" v-else>{{trimesterNum}}</view>
				</view>
				<view class="line"></view>
				<view class="list-item">
					<view class="list-title" @click="gotomonthCar(3,order_type)">一月内车单</view>
					<view class="list-msg null" v-if="monthNum == '' " ></view>
					<view class="list-msg" v-else>{{monthNum}}</view>
				</view>
				<!-- <view class="list-more">
					<text>更多</text>
					<text class="icon iconfont icon-jiantou"></text>
					<image src="" mode=""></image>
				</view> -->
			</view>
		</view>
		<view class="service">
			<view class="service-icon" @click="showPhone">
				<image src="../../static/service.png"></image>
			</view>

		</view>
		<view class="mask" v-show="isShow"></view>
		<view class="bottom-dialog-wrap" v-show="isShow">
			<view class="info-wrap" @click="phoneCall">
				<view class="info-item">
					<image src="../../static/app/phone.png" mode=""></image>
					<text>
						咨询电话:{{phone}}
					</text>
				</view>
			</view>
			<view class="dialog-btn" @click="closePhone">
				取消
			</view>
		</view>
		<view style="height: 100rpx;"></view>
		<mpvue-city-picker ref="mpvueCityPicker" :pickerValueDefault="cityPickerValueDefault" @onConfirm="onConfirm"></mpvue-city-picker>

		<footTabber></footTabber>

	</view>
</template>

<script>
	import mpvueCityPicker from '@/components/mpvue-citypicker/mpvueCityPicker.vue';
	export default {
		components: {
			mpvueCityPicker
		},
		data() {
			return {
				loadding: false,
				order_type:'',//1单位用车 2旅行用车 3个人用车
				adList: [
					'../../static/app/banner.png'
				],
				textData: [
					'通知1通知1通知1通知1通知1',
					'通知2通知2通知2通知2通知2'
				],
				selectCity: '选择省,市,区',
				/* 用车数据 */
				useCar: {
					unitCar: '', //单位用车数据
					travelCar: '', //旅行社用车数据
					personCar: '', //个人用车数据
					peer: '', //同行甩单数据
				},
				cityPickerValueDefault: [0, 0, 0],
				selectCity: '',
				province_id: 0,
				city_id: 0,
				region_id: 0,
				unitId: 1,
				travelId: 2,
				personId: 3,
				peerId: 4,
				todayNum: 0, //今日车单的数据 
				monthNum: '', //三月内车单的数据 
				trimesterNum: '', //一月内车单的数据 
				//slideshow:[],//轮播图
				detail: {
					avatarUrl: '', //头像
				},
				/*数据列表*/
				listData: [],
				/*当前第几页*/
				page: 1,
				/*当前选中的类别*/
				nowActive: 1,
				/* 位置 */
				location: '',
				tabId: '',
				isShow: false,
				phone: '0773-2625000',
				windowHeight: '', //手机高度
				msg:'',
				swiper:'',//轮播图
				carAll:'',//
			};
		},
		mounted() {
			// this.update();

		},
		onShow() {
			this.getData();//车单数据
			this.getLocation(); //仅支持APP，在此页面会报错
		},
		onLoad(option) {	
			let self = this;
			// if (uni.getStorageSync('token')) {
			// 	let classify = uni.getStorageSync('classify');		
			// 	self._get('user.index/detail', {}, function(res) {
			// 		if (res.data.code == -1) {		
			// 		} else {
			// 			if (classify == 2) {
			// 				uni.navigateTo({
			// 					url: '/pagesUser/home/home'
			// 				});
			// 			} else if (classify == 1) {
			// 				uni.navigateTo({
			// 					url: '/pages/home/home'
			// 				});
			// 			}
			// 		}
			// 	});
			// }
			self.getDatainfo();//个人信息			
			uni.getSystemInfo({
				success: (res) => {
					self.windowHeight = res.windowHeight;
				}
			});
			self.getData();//车单数据
			self.getLocation(); //仅支持APP，在此页面会报错
			//this.nowActive = option.nowActive;
			self.getinfo();//消息通知
			self.getSwiper();//轮播图
			self.getPhone();//咨询电话
			self.getCar_info();//获取车单总数
		},
		onPullDownRefresh() {
			this.getDatainfo();
			this.getData();
			this.getLocation();
			this.getinfo();
			this.getCar_info();
			//this.getSwiper();
			//this.getPhone();
			setTimeout( () => {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		onShow() {

		},
		methods: {
			/* 获取手机号码 */
			getPhone(){
				let self = this;
				uni.showLoading({
					title: '加载中'
				});
				self._post('index/config', {}, function(res) {
					self.phone = res.data.service_phone;
					self.loadding = true;
					uni.hideLoading();
				});
			},
			showPhone() {
				let self = this;
				self.isShow = true;
			},
			closePhone() {
				let self = this;
				self.isShow = false;
			},
			phoneCall() {
				let self = this;
				uni.makePhoneCall({
					phoneNumber: self.phone
				});
			},
			/*tab切换*/
			tabTypeFunc(e) {
				// if (e != this.nowActive) {
				// 	this.nowActive = e;
				// 	this.listData = [];
				// 	this.tabId = e;
				// 	this.getData();
				// }
				this.order_type = e;
				this.getData();
			},
			/*获取个人数据*/
			getDatainfo() {
				let self = this;
				uni.showLoading({
					title: '加载中'
				});
				self._get('user.index/detail', {}, function(res) {
					self.detail = res.data.userInfo;
					self.loadding = true;
					uni.hideLoading();
				});
			},
			/*获取轮播图*/
			getSwiper() {
				let self = this;
				uni.showLoading({
					title: '加载中'
				});
				self._get('plus.article.article/get_banner', {}, function(res) {
					
					self.swiper = res.data.banner.data;
					
					self.loadding = true;
					uni.hideLoading();
				});
			},
			/*获取消息数据*/
			getinfo() {
				let self = this;
				uni.showLoading({
					title: '加载中'
				});
				self._get('home/get_msg', {}, function(res) {
					
					self.msg = res.data.msg_list;
					//self.detail = res.data.userInfo;
					self.loadding = true;
					uni.hideLoading();
				});
			},
			/*获取车单分类总数数据*/
			getCar_info() {
				let self = this;
				uni.showLoading({
					title: '加载中'
				});
				self._get('order.CarOrder/get_order_count_total', {}, function(res) {
					
					self.carAll = res.data.count;
					//self.detail = res.data.userInfo;
					self.loadding = true;
					uni.hideLoading();
				});
			},
			/*获取车单数据*/
			getData() {
				let self = this;
				let page = self.page;
				uni.showLoading({
					title: '加载中'
				});
				self._get('order.CarOrder/get_order_count', {
						order_type:self.order_type,
						
					},
					function(res) {
						
						// self.useCar.unitCar = res.data.unitCar;
						// self.useCar.travelCar = res.data.travelCar;
						// self.useCar.personCar = res.data.personCar;
						// self.useCar.peer = res.data.peer;
						self.todayNum = res.data.day_count;
						self.monthNum = res.data.month_count;
						self.trimesterNum = res.data.tday_count;
						//self.slideshow = res.data.slideshow;
						
						self.loadding = true;
						uni.hideLoading();
					});
			},
			/* 获取当前位置 */
			getLocation() {
				let self = this;
				uni.getLocation({
					type: 'wgs84',
					geocode: true,
					success: function(res) {
						self.location = res.address.city;
					},
					fail: function(res) {
						
					}
				});
			},
			/*三级联动选择*/
			showMulLinkageThreePicker() {
				this.$refs.mpvueCityPicker.show();
			},
			/*确定选择的省市区*/
			onConfirm(e) {
				this.selectCity = e.label;
				this.province_id = e.cityCode[0];
				this.city_id = e.cityCode[1];
				this.region_id = e.cityCode[2];
				var str = this.selectCity.replace(/,/, "1");
				var str1 = str.indexOf("1");
				var str2 = str.indexOf(",");
				var str3 = str.substring(str1 + 1, str2);
				this.location = str3;
			},
			/*跳转页面*/
			gotoPage(path) {
				let self = this;
				if (path.startsWith('/')) {
					uni.navigateTo({
						url: path
					});
				} else {
					self[path]();
				}
			},
			gototodayCar(day_type,order_type) {
				uni.navigateTo({
					url: '/pages/home/todayCar/todayCar?select=1&&day_type=' + day_type+'&&order_type='+order_type
				});
			},
			gotomonthCar(day_type,order_type) {
				uni.navigateTo({
					url: '/pages/home/monthCar/monthCar?select=1&&day_type=' + day_type+'&&order_type='+order_type
				});
			},
			gototrimesterCar(day_type,order_type) {
				uni.navigateTo({
					url: '/pages/home/trimesterCar/trimesterCar?select=1&&day_type=' + day_type+'&&order_type='+order_type
				});
			}
		}
	}
</script>

<style lang="scss">
	@import 'home.scss';
</style>
